<template>
	<view>
		<mescroll-uni :height="height+'px'" @init="mescrollInit" :down="down" @down="downCallback" @up="upCallback">
			<view class="item" v-for="(item,index) in list" :key="index" @tap="goPage(item)">
				<view class="item-left" v-for="(fieldItem,Fidx) in field.filter(o=>o.name==='content')" :key="Fidx">
					{{item[fieldItem.name]}}
				</view>
				<view class="item-right">
					<view class="fieldItem price" v-for="(fieldItem,Fidx2) in field.filter(o=>o.name==='profit')"
						:key="Fidx2" :style="{color:item[fieldItem.name]>0?'#eda360':'#cb2d01'}">
						{{item[fieldItem.name]>0?'+':''}}{{item[fieldItem.name]}}
					</view>
					<view class="fieldItem" v-for="(fieldItem,Fidx3) in field.filter(o=>o.name==='create_time')"
						:key="Fidx3">
						{{format(new Date(item[fieldItem.name]).valueOf(),'MM-DD HH:mm')}}
					</view>
				</view>
			</view>
		</mescroll-uni>
	</view>
</template>

<script>
	import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
	import dayjs from 'dayjs'
	import {
		publicConfig
	} from "@/api"
	export default {
		mixins: [MescrollMixin], // 使用mixin
		props: {
			height: {
				type: Number,
				default: 300
			},
			params: {
				type: Object,
				default: () => {}
			}
		},
		mounted() {
			this.field = JSON.parse(uni.getStorageSync('commissionConfig'))?.countFieldList
		},
		data() {
			return {
				list: [],
				field: {},
				down: {
					auto: false
				}
			}
		},
		methods: {
			goPage(data) {
				if (data.routePath) {
					this.nav(`${data.routePath}`)
				}
			},
			format(value, type) {
				return dayjs(value).format(type)
			},
			// 下拉刷新
			downCallback(e) {
				this.list = []
				this.mescroll.resetUpScroll()
			},
			// 上拉加载
			upCallback(page) {
				this.formInit(page.num)
			},
			async formInit(page) {
				try {
					const params = JSON.parse(JSON.stringify({
						...this.params,
						page
					}))
					params.whereTime = params.whereTime ? this.formatParamTime(params.whereTime, 'year-month') +
						'-01' : ''
					const {
						data,
						code
					} = await publicConfig('getUserFuntypeList', params, false)
					if (code === 1) {
						this.list = [...this.list, ...data.list.data]
						const curPageLen = data.list.data.length
						const totalSize = data.list.total
						this.$emit('sendCount', data.count)
						this.mescroll.endBySize(curPageLen, totalSize)
						this.count = data.count
						uni.setNavigationBarTitle({
							title: data.count.title
						})
					}
				} catch (e) {
					this.mescroll.endErr()
				}
			},
		}
	}
</script>
<style lang="scss" scoped>
	.item {
		margin: 20rpx;
		padding: 20rpx;
		background-color: #fff;
		display: flex;
		justify-content: space-between;
		align-items: center;
		height: 125rpx;
		border-radius: 10rpx;

		&-left {
			word-break: break-all;
			overflow: hidden;
			display: -webkit-box;
			-webkit-line-clamp: 3;
			-webkit-box-orient: vertical;
			width: 70%;
			height: 100%;
		}

		&-right {
			flex: 1;
			text-align: right;
			font-size: 24rpx;
			display: flex;
			justify-content: space-between;
			flex-direction: column;
			height: 100%;
			color: #c5c5c5;
		}

		.price {
			font-size: 30rpx;
			color: #eda360;
			font-weight: bold;
		}
	}
</style>